<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>


    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/font-awesome.css}" rel="stylesheet"/>
    <link th:href="@{/css/animate.css}" rel="stylesheet"/>
    <link th:href="@{/css/style.css}" rel="stylesheet"/>

</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight no-padding">
        <div class="row">
            <div class="col-sm-6">
                    <div class="ibox-content">
                        <form class="form-horizontal m-t" id="commentForm">
                        	<div class="form-group">
                                <label class="col-sm-3 control-label">角色ID：</label>
                                <div class="col-sm-8">
                                    <label class="form-control" id="roleId" th:text="${roleId}"></label>
                                </div>
                            </div>
                           <div class="form-group">
                                <label class="col-sm-3 control-label">角色名称：</label>
                                <div class="col-sm-8">
                                    <input id="curl" type="text" class="form-control" name="roleName" maxlength="10"/>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">角色描述：</label>
                                <div class="col-sm-8">
                                    <input id="cur2" type="text" class="form-control" name="roleMemo" maxlength="140"/>
                                </div>
                            </div>
                            
                            <div class="form-group">
                                <div class="col-sm-4 col-sm-offset-3">
                                    <input class="btn btn-primary" type="button" onclick="upload()" value="提交"></input>
                                    
                                </div>
                            </div>
                        </form>
                    </div>
                </div>    
        </div>
    </div>

    <!-- 全局js -->
    <script th:src="@{/js/jquery.min.js?v=2.1.4}"></script>
    <script th:src="@{/js/bootstrap.min.js?v=3.3.6}"></script>

    <!-- 自定义js -->
    <script th:src="@{/js/content.js?v=1.0.0}"></script>


    <!-- jQuery Validation plugin javascript-->
    <script th:src="@{/js/plugins/validate/jquery.validate.min.js}"></script>
    <script th:src="@{/js/plugins/validate/messages_zh.min.js}"></script>
    <script th:src="@{/js/plugins/layer/layer.min.js}"></script>


    <script th:src="@{/js/demo/form-validate-demo.js}"></script>

    <script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
    <script>
        function  upload() {
            var role={
                roleId:$("#roleId").text(),
                roleName:$("input[name='roleName']").val(),
                roleMemo:$("input[name='roleMemo']").val()
            };

            $.ajax({
                type: "POST",
                url: "roleadd.shtml",
                data: role,
                async:false,
                success: function(data){
                    if(data=="t"){
                        layer.msg("添加成功!");
                        setTimeout(function () {
                            parent.location.reload();
                            var index=parent.layer.getFrameIndex(window.name);
                            parent.close(index);
                        },1000)

                    }else if(data=="f"){
                        layer.msg("添加失败");
                    }
                },
                error:function (XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg("添加失败");
                }
            });



        }
    </script>
</body>

</html>
